'use strict';
import React, {createClass, PropTypes} from 'react'
import {connect} from 'react-redux'
import {Link, withRouter} from 'react-router'
import { requestTestGroupListData } from '../actions'
import TestGroupList from '../components/TestGroupList'

const MainPage = createClass({
    componentDidMount() {
        const { dispatch } = this.props;
        dispatch(requestTestGroupListData());
    },
    render() {
        const { testGroupReducer } = this.props;
        if (testGroupReducer) {
            if(testGroupReducer.loading) {
                return <div className="loading"><div className="spinner"></div></div>
            }
            else if(testGroupReducer.status) {
                let listData = testGroupReducer.data;
                return <TestGroupList listData={listData} />
            }
            else {
                let errorMessage = testGroupReducer.error || '网络不可用';
                return <div className="load-error">{errorMessage}</div>
            }
        }
        else {
            return <div className="load-error">页面加载失败，点击重新加载...</div>
        }
    }
});

const mapStateToProps = (state) => {
    const { testGroupReducer } = state;
    return {
        testGroupReducer
    }
};

export default connect(mapStateToProps)(MainPage);